<template>
  <div id="statement">
      <h1>隐私声明</h1>
      <h2>尊敬的业主：</h2>
      <p> i业主软件为了给您提供更优质、更准确的服务，当您行使您业主权利时，系统会先收集并验证您的房产产权信息、个人（或法人）身份信息，通讯信息、银行卡信息（简称身份四元素信息）。</p>
      <p> 这些重要信息，只用于您和社区其他业主的行使社区权利时的真实性负责，以此构建合法、安全、可靠的i业主软件平台。</p>
      <p>i业主郑重向您承诺，在未事先征得您许可的情况下，绝不会将这些信息对外披露或向第三方提供，并且i业主系统服务器，在存储您四元素信息时，也采用了高级别的加密手段储存，连内部员工如果没有最高级权限，一样无法获得，这些技术加密方式都为了广大业主信息安全、能放心的行使您的业主权利。</p>
      <p>本隐私声明属于本应用服务使用协议里不可分割的一部分，您在同意本应用服务使用协议之时，即视为您已经同意本隐私权政策全部内容。</p>
      <strong>敬呈业主悉知</strong>
      <div class="agree-checkbox">
          <md-agree 
            v-model="agreeConf.checked"
            size="lg"
            >我同意认可i业主平台的使用协议和隐私制度</md-agree>
      </div>
      <div class="btn-block">
        <md-button type="primary" round @click="agreeStatement">下一步</md-button>
    </div>
  </div>
</template>

<script>
import {Agree,Button, Toast } from 'mand-mobile'
export default {
  components: {
      [Agree.name]: Agree,
      [Button.name]: Button,
  },
  name: 'statement',
  data () {
    return {
        agreeConf: {
            checked: true,
            introduction: '选中状态',
        },
    };
  },
  methods: {
    //   下一步
      agreeStatement(){
          if(this.agreeConf.checked){
              this.$router.replace({
                  path: '/register',
              })
          }else {
                Toast.failed('请先同意隐私声明')
          }
      }
  },
  created(){
 
    
  }
}
</script>

<style  lang="scss" scoped>
#statement {
    display: flex;
    flex-direction: column;
    align-items: center;
  padding: 10px 30px;
  h1 {
      font-size: 50px;
      padding: 40px 0;
  }
  h2 {
      width: 100%;
      font-size: 34px;
      color: #333;
      padding-bottom: 20px;
  }
  p {
      font-size: 28px;
      line-height: 44px;
      color: #666;
      text-indent: 2em;
      padding-bottom: 15px;
  }
  strong {
      font-size: 32px;
      color: #333;
      width: 100%;
      text-align: right;
  }
  .agree-checkbox {
      display: flex;
      justify-content: center;
      font-size: 16px;
      color: #666;
      margin: 30px 0 50px;
  }
   .btn-block {
        button {
            width: 250px;
            height: 70px;
            font-size: 30px;

        }
  }
}
</style>
